<template>
  <!--头部导航-->
  <div class="view-top">
    <el-row type="flex">
      <!--left-->
      <el-col :span="8">
        <el-menu :default-active="activeIndex2" class="height35" mode="horizontal" @select="">
          <el-menu-item index="1-1"><a href="https://www.yaolaivip.com/" target="_blank">耀莱在线官网</a></el-menu-item>
          <el-menu-item index="1-2"><a href="/" target="_blank">耀莱在线商家后台</a></el-menu-item>
        </el-menu>
      </el-col>
      <!--right-->
      <el-col :span="8" :push="12">
        <el-menu :default-active="activeIndex3" class="height35" mode="horizontal" @select="">
          <!--<el-menu-item index="2-1"><i class="iconfont icon-geren"></i></el-menu-item>-->
          <!--<el-menu-item index="2-2"><i class="iconfont icon-duihua"></i></el-menu-item>-->
          <!--<el-menu-item index="2-3"><i class="iconfont icon-guanli"></i></el-menu-item>-->
          <el-menu-item index="2-3" @click="logout"><i class="iconfont icon-tuichu"></i>退出</el-menu-item>
        </el-menu>
      </el-col>
    </el-row>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/index' }"
                          v-if="urlIndex('index')">首页</el-breadcrumb-item>
      <!--商家管理-->
      <el-breadcrumb-item
        :to="{ path: '/query-list' }"
        v-if="urlIndex(['query-list','get-detail','update-vendor','add-vendor'])">商家管理
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/get-detail/' + this.$route.params.id}"
        v-if="urlIndex('get-detail', this.$route.params.id)">商家详情（{{vendorName}}）
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/update-vendor/' + this.$route.params.id}"
        v-if="urlIndex('update-vendor', this.$route.params.id)">商家变更（{{vendorName}}）
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/add-vendor' }"
        v-if="urlIndex('add-vendor')">创建商家
      </el-breadcrumb-item>
      <!--店铺管理-->
      <el-breadcrumb-item
        :to="{ path: '/storeManage' }"
        v-if="urlIndex(['storeManage','changeStoreInfo','editStoreContact',
                        'editStore', 'createstore','storeInfo', 'storeConfigure',
                        'editContract', 'editSaleInfo'
                        ])">
        店铺管理
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/storeInfo' }"
        v-if="urlIndex('storeInfo')">
        查看详情
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/editStore' }"
        v-if="urlIndex('editStore')">
        信息修改
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/storeConfigure' }"
        v-if="urlIndex('storeConfigure')">
        配置修改
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/editContract' }"
        v-if="urlIndex('editContract')">
        合同变更
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/editSaleInfo' }"
        v-if="urlIndex('editSaleInfo')">
        售后信息变更
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/createstore' }"
        v-if="urlIndex('createstore')">
        创建店铺
      </el-breadcrumb-item>
      <el-breadcrumb-item
        :to="{ path: '/luxuryGoodsSearchList' }"
        v-if="urlIndex('luxuryGoodsSearchList')">
        奢品管理
      </el-breadcrumb-item>
      
      
      

    </el-breadcrumb>
  </div>
</template>

<script>
  //  import axios from 'axios'
  import Hub from '@/assets/utils/Hub'
  import {mapGetters, mapActions} from 'vuex'
  export default {
    data () {
      return {
        activeIndex2: '0',
        activeIndex3: '0',
        vendorName: '无'
      }
    },

    computed: {
      // 映射State
      ...mapGetters([
        'apiUrl', 'isLogin'
      ])
    },
    created () {
      Hub.$on('breadVendorName', (name) => {
        this.vendorName = name
      })
    },
    methods: {
      ...mapActions([
        'getStorage', 'setStorage'
      ]),
      urlIndex (word) {
        let url = this.$route.path
        if (typeof word === 'string') {
          if (url.indexOf(word) !== -1) {
            return true
          }
        } else {
          for (let w in word) {
            if (url.indexOf(word[w]) !== -1) {
              return true
            }
          }
        }
      },
      logout () {
        localStorage.clear()
        this.$router.push('/login')
      }
    }
  }
</script>

<style lang="less">
  /*顶部*/
  .view-top {
    background: #eef1f6;
    overflow: hidden;
    .height35 {
      li {
        height: 35px;
        line-height: 35px;
      }
    }
    .el-breadcrumb {
      padding: 10px;
      margin: 10px;
      border: 1px solid #aaa;
    }
  }
</style>
